<template>
	<div>
		<el-card shadow="hover">
			<div>
				基本信息：
			</div>
			<el-row>
				<el-col :span="12">
					<el-card shadow="hover">
						<div class="txt-ino">商户编号：{{userInfo.merchant}}</div>
						<div class="txt-ino">商户名称：{{userInfo.user_name}}</div>
						<div class="txt-ino">通信地址：{{userInfo.address}}</div>
					</el-card>
				</el-col>
			</el-row>
		</el-card>


		<el-row :gutter="12">
			<el-col :span="8">
				<el-card shadow="always">
					<div class="txt-title">结算信息</div>
					<div class="txt-ino">账户状态：{{status[balance.rt5_accountStatus]}}</div>
					<div class="txt-ino">账户余额：{{balance.rt6_balance}}</div>
					<div class="txt-ino">冻结余额：{{balance.rt7_frozenBalance}}</div>
					<div class="txt-ino">T1余额：{{balance.rt9_T1Balance}}</div>
					<div class="txt-ino">可结算金额：{{balance.rt15_amountToBeSettled}}</div>
					<div class="butt"><el-button plain @click = "getBalance()">查看余额</el-button></div>
					<div class="input-box">
						<div class="box">
							<div class="txt-input">结算:</div>
							<div class="input-1"><el-input v-model="input" placeholder="请输入结算金额"></el-input></div>
							<div class="butt-input"><el-button plain @click="settlement()">结算</el-button></div>
						</div>
					</div>
				</el-card>
			</el-col>
			<el-col :span="8">
				<el-card shadow="hover">
					<div>敬请期待.....</div>
					<!-- <div class="txt-title">账号信息</div>
					<div class="txt-ino">登陆账号：</div>
					<div class="txt-ino">原登陆密码：</div>
					<div class="txt-ino">新登陆密码：</div>
					<div class="txt-ino">再次输入：</div> -->
				</el-card>
			</el-col>
		</el-row>
	</div>
</template>

<script>
	export default {
		data() {
			return {
	       userID: JSON.parse(window.localStorage.userInfo).userId,
				 userInfo:{},
				 balance:{},
				 input : '',
				 status : {'AVAILABLE' : '正常','FROZEN' : '冻结','FREEZE_DEBIT':'冻结出帐','FREEZE_CREDIT': '冻结入账','CANCELLED':'已注销'}
			};
		},
		methods: {
			getUserInfo(){
				let that = this;
				this.$axios({
					url: "/admin/master/getUserInfo",
					data: {
						userID: that.userID,
					},
					success(res) {
						if(res.data.code == 200){
							that.userInfo = res.data.content
							console.log(that.userInfo)
						}
					},
				});
			},
			getBalance(){
				let that = this;
				this.$axios({
					url: "/admin/master/getBalance",
					data: {
						userID: that.userID,
					},
					success(res) {
						if(res.data.code == 200){
							that.balance = res.data.content
							console.log(that.balance)
						}
					},
				});
			},
			settlement(){
				let that = this;
				this.$axios({
					url: "/admin/master/settlement",
					data: {
						userID: that.userID,
						money: that.input,
					},
					success(res) {
						that.$message({
						          showClose: true,
						          message: res.data.content.rt3_retMsg,
											duration:8000
						        });
					},
				});
			}

		},
		created() {
			this.getUserInfo();
		},
	};
</script>

<style>
	.txt-title{
		display: flex;
		align-items: center;
		justify-content: center;
		font-weight: bold;
	}
	.txt-ino{
		height: 40px;
		line-height: 40px;
	}

.txt-input{
	width: 80px;
	height: 80px;
	line-height: 80px;
}
.box{
	display: flex;
	width: 500px;
	height: 80px;
}
.input-1{
	display: flex;
	align-items: center;
}
.butt-input{
	height: 80px;
	line-height: 80px;
	margin-left: 50px;
}
</style>
